
<%@page contentType="text/html"%>
<%@page pageEncoding="UTF-8"%>

<%@ taglib uri="http://struts.apache.org/tags-bean" prefix="bean" %>
<%@ taglib uri="http://struts.apache.org/tags-html" prefix="html" %>
<%@ taglib uri="http://struts.apache.org/tags-logic" prefix="logic" %>

<html:html lang="true">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>Provider Headers </title>
        <script type="text/javascript">
            var i = 1;
            function addcolumn(){
                var column = " Header " + i + " 	<input name=\"columnnames\" id=\"i" + i + "\" type=\"text\" onkeyup=\"keyupevent(" + i + ")\"  />" +
                    "<input id=\"c" + i +"\" value=\"true\" type=\"checkbox\"  onclick=\"checkboxchange("+ i +")\"   />  <input id=\"h"+i+"\" value=\"false\" type=\"hidden\" name=\"required\"    />"
                    +"<span id=\"s" +i +"\"> "+
                    " <input type=\"hidden\" name=\"columntypes\" value=\"\" /> <input type=\"hidden\" name=\"accuracylevels\" value=\"\" />"
                    +" </span> <br>";
                var div = document.getElementById("columns");
                div.innerHTML += column;
                i++;
            }
            
            function checkboxchange(no){
                var hidden = document.getElementById("h" + no);
                keyupevent(no);
            }
            
            function keyupevent(no){
                var span = document.getElementById("s" + no);
                var checkbox = document.getElementById("c" + no);
                var text = document.getElementById("i" + no).value;
                var hidden = document.getElementById("h" + no);
                
                if (checkbox.checked) {
                    if (text.toLowerCase() == "length" ||text.toLowerCase() == "width" ||text.toLowerCase() == "weight" ||text.toLowerCase() == "pages" ||text.toLowerCase() == "depth" ||text.toLowerCase() == "mailformat" ||text.toLowerCase() == "format" ||text.toLowerCase() == "items") {
                        span.innerHTML = "<select name=\"columntypes\">  <option value=\"TINYINT\">TINYINT</option><option value=\"SMALLINT\">SMALLINT</option><option value=\"MEDIUMINT\">MEDIUMINT</option><option value=\"INT\">INT</option><option value=\"BIGINT\">BIGINT</option><option value=\"DECIMAL\">DECIMAL</option><option value=\"FLOAT\">FLOAT</option><option value=\"DOUBLE\">DOUBLE</option><option value=\"BIT\">BIT</option><option value=\"CHAR\">CHAR</option><option value=\"VARCHAR(15)\">VARCHAR(15)</option><option value=\"TINYTEXT\">TINYTEXT</option><option value=\"TEXT\">TEXT</option><option value=\"MEDIUMTEXT\">MEDIUMTEXT</option><option value=\"LONGTEXT\">LONGTEXT</option><option value=\"BINARY\">BINARY</option><option value=\"VARBINARY\">VARBINARY</option><option value=\"DATE\">DATE</option><option value=\"DATETIME\">DATETIME</option><option value=\"TIME\">TIME</option><option value=\"TIMESTAMP\">TIMESTAMP</option><option value=\"YEAR\">YEAR</option><option value=\"TINYBLOB\">TINYBLOB</option><option value=\"BLOB\">BLOB</option><option value=\"MEDIUMBLOB\">MEDIUMBLOB</option><option value=\"LONGBLOB\">LONGBLOB</option><option value=\"SET\">SET</option><option value=\"ENUM\">ENUM</option>  </select>  <select name=\"accuracylevels\"> 	<option value=\"1\">1</option><option value=\"2\">2</option><option value=\"3\">3</option><option value=\"4\">4</option><option value=\"5\">5</option><option value=\"6\">6</option><option value=\"7\">7</option><option value=\"8\">8</option><option value=\"9\">9</option><option value=\"10\">10</option></select> ";
                    }
                    else {
                        span.innerHTML = "<select name=\"columntypes\">  <option value=\"TINYINT\">TINYINT</option><option value=\"SMALLINT\">SMALLINT</option><option value=\"MEDIUMINT\">MEDIUMINT</option><option value=\"INT\">INT</option><option value=\"BIGINT\">BIGINT</option><option value=\"DECIMAL\">DECIMAL</option><option value=\"FLOAT\">FLOAT</option><option value=\"DOUBLE\">DOUBLE</option><option value=\"BIT\">BIT</option><option value=\"CHAR\">CHAR</option><option value=\"VARCHAR(15)\">VARCHAR(15)</option><option value=\"TINYTEXT\">TINYTEXT</option><option value=\"TEXT\">TEXT</option><option value=\"MEDIUMTEXT\">MEDIUMTEXT</option><option value=\"LONGTEXT\">LONGTEXT</option><option value=\"BINARY\">BINARY</option><option value=\"VARBINARY\">VARBINARY</option><option value=\"DATE\">DATE</option><option value=\"DATETIME\">DATETIME</option><option value=\"TIME\">TIME</option><option value=\"TIMESTAMP\">TIMESTAMP</option><option value=\"YEAR\">YEAR</option><option value=\"TINYBLOB\">TINYBLOB</option><option value=\"BLOB\">BLOB</option><option value=\"MEDIUMBLOB\">MEDIUMBLOB</option><option value=\"LONGBLOB\">LONGBLOB</option><option value=\"SET\">SET</option><option value=\"ENUM\">ENUM</option>  </select> <input type=\"hidden\" name=\"accuracylevels\" value=\"\" />";
                    }
                    hidden.value="true";
                }
                else {
                    span.innerHTML = " <input type=\"hidden\" name=\"columntypes\" value=\"\" />   <input type=\"hidden\" name=\"accuracylevels\" value=\"\" />";
                    hidden.value="false";
                }
            }
         
            function MyMethod()
            {
                for(j=1;j<=i;j++)
                {
                    var colname=document.getElementById("i"+j).value;
                    if(colname.length==0)
                    {
                        document.getElementById("noname").innerHTML="Please,Enter Column Name";
                        return false;
                    }
                }
                return true;
            }
        </script>
    </head>
    <body style="background-color: white">
        <html:form action="/Next3" onsubmit="return MyMethod();">
            <html:hidden property="index" value="providertable"/>
            <h2>Adding New provider (Step Three)</h2><br>
            <input type="button" value="Add Header" onclick="addcolumn()"/>
            <div id="columns"></div><div id="noname"></div>
            <html:errors property="EmptyColumnName"></html:errors>
            <html:submit value="Next"/>
        </html:form>
        <script type="text/javascript">
            function disableMe() {
                ch = required.checked;
                
                var fromParameters = 0;
                parameters = ["width", "length", "depth", "pages", "weight", "format", "mailformat", "items"];
                for (j=0; j<8 && fromParameters==0; j++) {
                    if(columnnames.value == parameters[j])
                        fromParameters=1;
                }
                if(ch == true){
                    columntypes.disabled = false;
                    if (fromParameters == 1) {
                        accuracylevels.disabled = false;
                    }
                }
                if(ch == false){
                    s=document.getElementById("columntypes")
                    s.disabled=true
                    s=document.getElementById("accuracylevels")
                    s.disabled=true
                }
                alert("el jjjjjjj"+j)
            }
        </script>
    </body>
</html:html>
